require(['./config'], () => {
  // 先引入config，让哪些配置生效，然后就可以使用配置好的段名称来引入需要的模块
  require(['swiper', 'template','jquery','listofheader', 'listoffooter'], (Swiper,template) => {
    // 这个函数是在所有依赖模块执行完了之后执行
    class Index {
      constructor () {
        this.init()
		this.getList()
      }
      init () {
        new Swiper('.swiper-container',{
        	pagination:{
        		el:'.swiper-pagination',
				clickable :true,
        	},
			loop: true,
        	autoplay:{
        		delay:2000
        	},
        	on:{
        	    slideChangeTransitionEnd: function(){
        	      // console.log(1)
        	    },
        	  },
        })
      }
	  
	  getList () {
	    // 获取熊猫优选数据渲染
	    $.get('http://www.xiongmaoyouxuan.com/api/tab/2?start=0', resp => {
			console.log(resp.data.items.list)
	      if (resp.code === 200) {
	        let { list } = resp.data.items
			console.log(list)
		  	let list1 = list.slice(0,4)
			let list2 = list.slice(5,9)
			let list3 = list.slice(9,13)
			let list4 = list.slice(13,17)
			let list5 = list.slice(16,20)
			// let list6 = list.slice(0,4)
			const html1 = template('phonelisttemplate1', { list1 })
	        $('#phonelist1').html(html1)
			const html2 = template('phonelisttemplate2', { list2 })
			$('#phonelist2').html(html2)                   
			const html3 = template('phonelisttemplate3', { list3 })
			$('#phonelist3').html(html3)                   
			const html4 = template('phonelisttemplate4', { list4 })
			$('#phonelist4').html(html4)                   
			const html5 = template('phonelisttemplate5', { list5 })
			$('#phonelist5').html(html5)                   
			const html6 = template('phonelisttemplate6', { list1 })
			$('#phonelist6').html(html6)
	      }
	    })
	  }
    }
    new Index()
  })
})

